<template>
	<cu-custom :isBack="true">
		<template #title>生成报告</template>
	</cu-custom>
	<view class="main-box">
		<view class="main-title">请选择相关材料（可多选）</view>
		<view class="text-blue small-text" @click="navToAIReport">查看报告</view>
	</view>
	
	<view class="mb-4">
		<checkbox-group class="block" @change="checkboxChange">
			<view class="cu-form-group" v-for="(item, index) in checkboxData" :key="index">
				<view class="title text-ellipsis-1">{{ item.name }}</view>
				<checkbox
					class="round"
					activeBackgroundColor="#3974df"
					:checked="item.checked ? true : false"
					:value="item.value">
				</checkbox>
			</view>
		</checkbox-group>
		
		<view v-if="checkboxData.length === 0" class="text-gray text-center">
			当前未上传任何材料
		</view>
	</view>
	
	<view class="page-content">
		<view class="mb-4">
			<CuButton @click="handleCreate">AI智能生成报告</CuButton>
		</view>
	</view>
	
	<Dialog message="报告生成中" type="loading" v-model:show="dialogShow" @confirm="handleConfirm" />
</template>

<script setup lang="ts">
import { ref, type Ref } from 'vue';
import CuButton from "@/components/CuButton.vue"
import Dialog from "@/components/Dialog.vue"
import { router } from "@/router"
import { getMissionRecord } from "@/api/mission.js"
import { onLoad } from "@dcloudio/uni-app"
import { getSuffix } from "@/utils/base"
import { createReport } from "@/api/mission.js"

interface IFile {
	name: string
	status: string
	uid: number
	url: string
}
interface ICheckbox {
	name: string
	value: string
	checked: boolean
}

const props = defineProps({
	mission_id: {
		type: String,
		default: null
	}
})

let mission_id = null
const dialogShow:Ref<boolean> = ref(false)
const checkboxData = ref([] as ICheckbox[])
let currentCheckedData:string[] = null

const checkboxChange = (e:any):void => {
	currentCheckedData = e.detail.value
}
const handleCreate = () => {
	
	if (!currentCheckedData || currentCheckedData.length === 0) {
		uni.showToast({
			icon: "none",
			title: "请至少选择一项材料"
		})
		return
	}
	const materialFiles = []
	
	currentCheckedData.map((data) => {
		materialFiles.push(JSON.parse(data))
	})
	console.log(materialFiles)
	uni.showLoading({
		title: "提交中"
	})
	createReport({
		taskId: mission_id,
		materialFiles: materialFiles
	}).then((res) => {
		uni.hideLoading()
		dialogShow.value = true
	})
	
}

const handleConfirm = () => {
	dialogShow.value = false
	router.replace("/pages/mission/ai_report?mission_id=" + mission_id)
}

const navToAIReport = () => {
	router.push("/pages/mission/ai_report?mission_id=" + mission_id)
}

const loadData = () => {
	getMissionRecord(mission_id)
		.then((res) => {
			console.log(res)
			const data = []
			res.records.map((record: any) => {
				const files = JSON.parse(record.fileUrl)
				if (files) {
					files.map((file: IFile) => {
						if (["pdf", "doc", "docx"].includes(getSuffix(file.name))) {
							data.push({
								name: file.name,
								value: JSON.stringify({
									name: file.name,
									url: file.url
								}),
								checked: false
							})
						}
					})
				}
			})
			checkboxData.value = data
			
		})
}

onLoad((options) => {
	mission_id = options.mission_id
	loadData()
})
</script>

<style lang="stylus" scoped>
.main-box
	padding 20rpx
	color: #999
	background-color: #fff
	margin-bottom: 20rpx
	display: flex
	justify-content: space-between
	align-items: center
	.main-title
		border-left: 10rpx solid #3974df
		padding-left 10rpx
		font-size: 32rpx
</style>